// 页面加载动画
document.addEventListener('DOMContentLoaded', () => {
    document.body.style.opacity = '0';
    setTimeout(() => {
        document.body.style.opacity = '1';
    }, 100);
});

// 快捷问题点击处理
document.querySelectorAll('.question-btn').forEach(btn => {
    btn.addEventListener('click', () => {
        const question = btn.querySelector('span').textContent;
        handleQuestion(question);
    });
});

// 控制按钮处理
document.querySelectorAll('.control-btn').forEach(btn => {
    btn.addEventListener('click', function() {
        const type = this.querySelector('span')?.textContent || 'voice';
        handleControlClick(type);
    });
});

// 返回按钮处理
document.querySelector('.back-btn').addEventListener('click', function(e) {
    e.preventDefault();
    document.body.style.opacity = '0';
    setTimeout(() => {
        window.location.href = '../index.html';
    }, 300);
});

// 发送按钮点击处理
document.querySelector('.send-btn').addEventListener('click', () => {
    const input = document.querySelector('.input-group input');
    const question = input.value.trim();
    if (question) {
        handleQuestion(question);
        input.value = '';
    }
});

// 输入框回车处理
document.querySelector('.input-group input').addEventListener('keypress', (e) => {
    if (e.key === 'Enter') {
        const question = e.target.value.trim();
        if (question) {
            handleQuestion(question);
            e.target.value = '';
        }
    }
});

// 处理问题函数
function handleQuestion(question) {
    // 添加用户问题到对话区域
    addUserMessage(question);
    
    // 添加AI正在思考的提示
    const chatContainer = document.querySelector('.chat-container');
    const thinkingDiv = document.createElement('div');
    thinkingDiv.className = 'ai-message thinking';
    thinkingDiv.innerHTML = `
        <div class="ai-avatar">
            <img src="https://picsum.photos/60/60" alt="AI医生头像">
        </div>
        <div class="message-content">
            <p><i class="fas fa-spinner fa-pulse"></i> 正在思考...</p>
        </div>
    `;
    chatContainer.appendChild(thinkingDiv);
    scrollToBottom();
    
    // 向后端发送请求
    sendQuestionToBackend(question)
        .then(response => {
            // 移除思考提示
            chatContainer.removeChild(thinkingDiv);
            
            // 添加AI回答
            addAIMessage(response.data);
        })
        .catch(error => {
            // 移除思考提示
            chatContainer.removeChild(thinkingDiv);
            
            // 显示错误信息
            addAIMessage('抱歉，服务器暂时无法回应，请稍后再试。' + (error.message ? `错误信息: ${error.message}` : ''));
        });
}

// 向后端发送请求并解析R类响应
async function sendQuestionToBackend(question) {
    try {
        const response = await fetch('/api/medicine/query', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify({ question })
        });
        
        if (!response.ok) {
            throw new Error(`服务器响应错误: ${response.status}`);
        }
        
        const result = await response.json();
        
        // 解析R类响应
        if (result.code === 200) {
            return {
                success: true,
                data: result.data.answer || '暂无相关信息'
            };
        } else {
            return {
                success: false,
                data: `请求失败: ${result.message || '未知错误'}`
            };
        }
    } catch (error) {
        console.error('API请求错误:', error);
        throw error;
    }
}

// 添加用户消息到对话区域
function addUserMessage(message) {
    const chatContainer = document.querySelector('.chat-container');
    const messageDiv = document.createElement('div');
    messageDiv.className = 'user-message';
    messageDiv.innerHTML = `
        <div class="message-content">
            <p>${message}</p>
        </div>
    `;
    chatContainer.appendChild(messageDiv);
    scrollToBottom();
}

// 添加AI消息到对话区域
function addAIMessage(message) {
    const chatContainer = document.querySelector('.chat-container');
    const messageDiv = document.createElement('div');
    messageDiv.className = 'ai-message';
    messageDiv.innerHTML = `
        <div class="ai-avatar">
            <img src="https://picsum.photos/60/60" alt="AI医生头像">
        </div>
        <div class="message-content">
            <p>${message}</p>
        </div>
    `;
    chatContainer.appendChild(messageDiv);
    scrollToBottom();
}

// 滚动到底部
function scrollToBottom() {
    const chatContainer = document.querySelector('.chat-container');
    chatContainer.scrollTop = chatContainer.scrollHeight;
}

// 处理控制按钮点击
function handleControlClick(type) {
    switch(type) {
        case '中字':
            alert('已开启中文字幕');
            break;
        case '使用须知':
            showUsageGuide();
            break;
        default: // voice
            toggleVoice();
            break;
    }
}

// 显示使用指南
function showUsageGuide() {
    alert(`AI用药助手使用须知：
1. 本助手提供的建议仅供参考
2. 具体用药请遵医嘱
3. 如有不适请及时就医
4. 请勿过量服用药物`);
}

// 切换语音功能
function toggleVoice() {
    const voiceBtn = document.querySelector('.control-btn i.fa-volume-up');
    if (voiceBtn.classList.contains('fa-volume-up')) {
        voiceBtn.classList.replace('fa-volume-up', 'fa-volume-mute');
        alert('语音已关闭');
    } else {
        voiceBtn.classList.replace('fa-volume-mute', 'fa-volume-up');
        alert('语音已开启');
    }
}

// 举报功能
document.querySelector('.report-btn').addEventListener('click', () => {
    alert('感谢您的反馈，我们会认真处理您的举报。');
}); 